$(function() {
    var bg = "music/bg.mp3";
    var bgA = new Audio(bg);
    var xiu = "music/xiu.mp3";
    var xiuA = new Audio(xiu);
	var Obj = {};
	Obj.luckyResult = [];
	Obj.luckyPrize = '';
	Obj.luckyNum = 1;
    Obj.resIndex = '';

	function loadImage(arr, callback) {
		var loadImageLen = 1;
		var arrLen = arr.length;
		$('.all_number').html("/" + arrLen);
		for (var i = 0; i < arrLen; i++) {
			var img = new Image();
			img.onload = function() {
				img.onload = null;
				++loadImageLen;
				$(".current_number").html(loadImageLen);
				if (loadImageLen == arrLen) {
					callback(img);
				};
			}
			img.src = arr[i].image;
		}
	}
	Obj.M = $('.container').lucky({
		row: 7,
		col: 5,
		depth: 5,
		iconW: 30,
		iconH: 30,
		iconRadius: 8,
		data: personArray,
	});
	loadImage(personArray, function(img) {
		$('.loader_file').hide();
	});

	function showLuckyPeople(num) {
		setTimeout(function() {
			var $luckyEle = $('<img class="lucky_icon" />');
			var $userName = $('<p class="lucky_userName"></p>');
			var $fragEle = $('<div class="lucky_userInfo"></div>');
			$fragEle.append($luckyEle, $userName);
			$('.mask').append($fragEle);
			$(".mask").fadeIn(200);
			$luckyEle.attr('src', personArray[Obj.luckyResult[num]].image);
			$userName.text(personArray[Obj.luckyResult[num]].name)
			$fragEle.animate({
				'left': '50%',
				'top': '50%',
				'height': '200px',
				'width': '200px',
				'margin-left': '-100px',
				'margin-top': '-100px',
			}, 1000, function() {
				setTimeout(function() {
					$fragEle.animate({
						'height': '100px',
						'width': '100px',
						'margin-left': '100px',
						'margin-top': '-50px',
					}, 400, function() {
						$(".mask").fadeOut(0);
						$luckyEle.attr('class', 'lpl_userImage').attr('style', '');
						$userName.attr('class', 'lpl_userName').attr('style', '');
						$fragEle.attr('class', 'lpl_userInfo').attr('style', '');
						$('.lpl_list.active').append($fragEle);
					})
				}, 500)
			})
		}, 500)
		setTimeout(function() {
			$('.lucky_list').show();
		}, 500)
	}
	$('#stop').click(function() {
        bgA.pause();
        xiuA.play();
        Obj.M.stop();
        $(".container").hide();
        $(this).hide();
        showLuckyPeople(Obj.resIndex);
	})
	$('#open').click(function() {
		$('.lucky_list').hide();
		$(".container").show();
		Obj.M.open();
        bgA.play(); //播放
        xiuA.load();
		randomLuckyArr();
		setTimeout(function() {
			$("#stop").show(500);
		}, 1000)
	})

	function randomLuckyArr() {
        Obj.resIndex = '';
        for (var i = 0; i < Obj.luckyNum; i++) {
            var random = Math.floor(Math.random() * personArray.length);
            if (Obj.luckyResult.indexOf(random) == -1) {
                Obj.luckyResult.push(random);
                Obj.resIndex = Obj.luckyResult.indexOf(random);
            } else {
                i--;
            }
        }
	}

	function tabPrize() {
		var luckyDefalut = $(".lucky_prize_picture").attr('data-default');
		var index = luckyDefalut ? luckyDefalut : 1;
		tabSport(index);
		var lucky_prize_number = $('.lucky_prize_show').length;
		$('.lucky_prize_left').click(function() {
			$('.lucky_prize_right').addClass('active');
			index <= 1 ? 1 : --index;
			tabSport(index, lucky_prize_number);
		})
		$('.lucky_prize_right').click(function() {
			$('.lucky_prize_left').addClass('active');
			index >= lucky_prize_number ? lucky_prize_number : ++index;
			tabSport(index, lucky_prize_number);
		})
	}

	function tabSport(i, lucky_prize_number) {
		if (i >= lucky_prize_number) {
			$('.lucky_prize_right').removeClass('active');
		}
		if (i <= 1) {
			$('.lucky_prize_left').removeClass('active');
		}
		Obj.luckyPrize = i;
		$('.lucky_prize_show').hide().eq(i - 1).show();
		$(".lucky_prize_title").html($('.lucky_prize_show').eq(i - 1).attr('alt'));
		$('.lpl_list').removeClass('active').hide().eq(i - 1).show().addClass('active');
	}
	tabPrize();
});
